<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<h1>axios入门案例</h1>
		<script src="../js/axios.js"></script>
		<script>
		//3.Axios优化
		axios.defaults.baseURL = "http://localhost:8080"
		
		//promise是Axios封装服务器返回值的象
		let url1="http://localhost:8080/axios/findStr"
		axios.get(url1)
			.then(function(promise){
				console.log(promise)
				console.log(promise.data)
			})
			
			let url2 = "http://localhost:8080/axios/getUserById?id=10";
			axios.get(url2)
				.then(function(promise){
					console.log(promise.data)
				})
				
			//3.对象参数传递写法	  利用API自动拼接参数
			let user = {id:100,name: "tomacat" ,age:9999999}
			axios.get("/axios/findUser",{params: user})
				.then(function(promise){
					console.log(promise.data)
				})
				
			//4.RestFul结构实现数据传递
			let rest1 = {id:888 ,name:"漂亮",age:80}
			axios.get("/axios/result/"+rest1.id+"/"+rest1.name+"/"+rest1.age)
					.then(function(promise){
						console.log(promise.data)
				})
				
			/**5.RestFul结构实现数据传递
			第二种：模板字符串写发
			语法：反引号
			字符取值：${rest2.id}
			作用:
				1.常见字符串拼接
				2.可以保证代码的数据结构
			*/
			let rest2 = {id:668 ,name:"美丽",age:50}
			axios.get(`/axios/result/${rest2.id}/${rest2.name}/${rest2.age}`)
				.then(function(promise){
						console.log(promise.data)
				})
				
				//模板字符串 保证代码格式
			let div = `<div>
							<p>天青色等烟雨</p>
							<p>而我在等你</p>
							<p>炊烟袅袅升起</p>
							<p>隔江千万里</p>
					   </div>`
		</script>
	</body>
</html>
